.pluginD-pluginInfo {
    background: #fff;
    padding-top: 55px;

    .pluginD-pluginInfo-top {
        display: flex;
        width: 1280px;
        margin: 0 auto;
        align-items: center;
        justify-content: center;

        .pluginD-pluginInfo-img {
            width: 802px;
            height: 452px;
            border: 1px solid transparent;
            background-color: #f7f7f7;
            text-align: center;

            &:hover {
                border: 1px solid #e6e6e6;
            }

            img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }

            .anticon {
                font-size: 452px;
            }
        }

        .pluginD-pluginInfo-can {
            margin-left: 45px;
            padding-left: 12px;
            border-left: 1px solid rgba(0, 0, 0, .15);

            .pluginD-pluginInfo-can-info {
                margin: 25px 0;
                line-height: 50px;
                height: 50px;
                font-size: 20px;
                font-weight: 600;
                color: #534e4e;


                .anticon {
                    float: left;
                    font-size: 50px;
                    margin-right: 15px;
                }

                .chrome {
                    color: #ff964f;
                }

                .fire {
                    color: #7ccc4f;
                }

                .safa {
                    color: #38ccef;
                }

                .ie {
                    color: #44baff;
                }
            }

            .pluginD-pluginInfo-can-info-num {
                font-size: 25px;
            }
        }
    }

    .pluginD-pluginInfo-btn {
        text-align: center;
        padding-top: 30px;

        button {
            margin: 0 30px;
        }
    }

    .pluginD-pluginInfo-desc {
        width: 1160px;
        margin: 0 auto;
        padding: 0 10px;
        margin-top: 30px;
        color: rgb(102, 102, 102);
        font-size: 16px;
        font-weight: 400;
    }

    .pluginD-pluginInfo-use {
        width: 1160px;
        margin: 0 auto;
        padding: 0 10px;
        padding-top: 45px;

        .use-line {
            margin-bottom: 30px;

            .ant-divider-inner-text {
                line-height: 16px;
                color: #777;
                font-size: 16px;
            }
        }

        .use-text-update {
            padding-top: 5px;
            padding-left: 5px;
            max-height: 300px;
            overflow: auto;

            .use-text-update-time {
                color: #0b8235;
                font-weight: 600;
            }
        }

        .ant-divider-with-text::after,
        .ant-divider-with-text::before {
            border-top: 1px solid #eaeaea;
        }

        // .hljs {
        //     display: block;
        //     overflow-x: auto;
        //     padding: 0.5em;
        //     background: #1E1E1E;
        //     color: #DCDCDC;
        // }

        // .hljs-keyword,
        // .hljs-literal,
        // .hljs-symbol,
        // .hljs-name {
        //     color: #569CD6;
        // }

        // .hljs-link {
        //     color: #569CD6;
        //     text-decoration: underline;
        // }

        // .hljs-built_in,
        // .hljs-type {
        //     color: #4EC9B0;
        // }

        // .hljs-number,
        // .hljs-class {
        //     color: #B8D7A3;
        // }

        // .hljs-string,
        // .hljs-meta-string {
        //     color: #D69D85;
        // }

        // .hljs-regexp,
        // .hljs-template-tag {
        //     color: #9A5334;
        // }

        // .hljs-subst,
        // .hljs-function,
        // .hljs-title,
        // .hljs-params,
        // .hljs-formula {
        //     color: #DCDCDC;
        // }

        // .hljs-comment,
        // .hljs-quote {
        //     color: #57A64A;
        //     font-style: italic;
        // }

        // .hljs-doctag {
        //     color: #608B4E;
        // }

        // .hljs-meta,
        // .hljs-meta-keyword,
        // .hljs-tag {
        //     color: #9B9B9B;
        // }

        // .hljs-variable,
        // .hljs-template-variable {
        //     color: #BD63C5;
        // }

        // .hljs-attr,
        // .hljs-attribute,
        // .hljs-builtin-name {
        //     color: #9CDCFE;
        // }

        // .hljs-section {
        //     color: gold;
        // }

        // .hljs-emphasis {
        //     font-style: italic;
        // }

        // .hljs-strong {
        //     font-weight: bold;
        // }

        // .hljs-bullet,
        // .hljs-selector-tag,
        // .hljs-selector-id,
        // .hljs-selector-class,
        // .hljs-selector-attr,
        // .hljs-selector-pseudo {
        //     color: #D7BA7D;
        // }

        // .hljs-addition {
        //     background-color: #144212;
        //     display: inline-block;
        //     width: 100%;
        // }

        // .hljs-deletion {
        //     background-color: #600;
        //     display: inline-block;
        //     width: 100%;
        // }
    }

    .pluginD-pluginInfo-more {
        text-align: center;
        width: 1160px;
        margin: 0 auto;
        padding-bottom: 50px;

        .use-line {
            margin-bottom: 30px;

            .more-item {
                color: #777;
                margin: 0 15px;
                font-size: 16px;

                .anticon {
                    font-size: 16px;
                }
            }
        }

        .pluginD-pluginInfo-more-like {
            width: 50px;
            height: 50px;
            box-sizing: border-box;
            display: inline-block;
            vertical-align: middle;
            border-radius: 50%;
            background: #ed4630;
            text-align: center;
            line-height: 65px;
            cursor: pointer;
            position: relative;
        }

        .pluginD-pluginInfo-more-like-none {
            width: 50px;
            height: 50px;
            box-sizing: border-box;
            display: inline-block;
            vertical-align: middle;
            border-radius: 50%;
            background: #ed4630;
            text-align: center;
            line-height: 60px;
            cursor: pointer;
            position: relative;

            .anticon {
                color: #FFF;
                font-size: 30px;
            }
        }
    }
}